neo.mjs 5.5.4 → 5.5.6

package/apps/ServiceWorker.mjs

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

package/examples/ServiceWorker.mjs

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

package/package.json

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

package/resources/scss/src/form/field/CheckBox.scss

@@ -40,6 +40,14 @@
         margin-top : .3em;
         white-space: break-spaces;
         word-break : break-word;
+
+        &.neo-absolute {
+            position: absolute;
+        }
+    }
+
+    .neo-error-wrapper {
+        position: relative;
     }
 
     &.neo-invalid {

package/resources/scss/src/form/field/Text.scss

@@ -325,6 +325,14 @@
         margin-top : .3em;
         white-space: break-spaces;
         word-break : break-word;
+
+        &.neo-absolute {
+            position: absolute;
+        }
+    }
+
+    .neo-textfield-error-wrapper {
+        position: relative;
     }
 
     .neo-textfield-input {

package/src/DefaultConfig.mjs

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

package/src/form/field/CheckBox.mjs

@@ -38,6 +38,11 @@ class CheckBox extends Base {
          * @member {String|null} error_=null
          */
         error_: null,
+        /**
+         * Useful for fields inside a css grid where errors should live outside the layout
+         * @member {Boolean} errorPositionAbsolute_=false
+         */
+        errorPositionAbsolute_: false,
         /**
          * @member {Function} errorTextGroupRequired='Required'
          */
@@ -126,7 +131,9 @@ class CheckBox extends Base {
                 {tag: 'i',     cls: ['neo-checkbox-icon']},
                 {tag: 'span',  cls: ['neo-checkbox-value-label']}
             ]},
-            {cls: ['neo-error'], removeDom: true}
+            {cls: ['neo-error-wrapper'], removeDom: true, cn: [
+                {cls: ['neo-error']}
+            ]}
         ]}
     }
 
@@ -189,6 +196,21 @@ class CheckBox extends Base {
         this.updateError(value)
     }
 
+    /**
+     * Triggered after the errorPositionAbsolute config got changed
+     * @param {Boolean} value
+     * @param {Boolean} oldValue
+     * @protected
+     */
+    afterSetErrorPositionAbsolute(value, oldValue) {
+        let me  = this,
+            cls = me.vdom.cn[1].cn[0].cls;
+
+        NeoArray[value ? 'add' : 'remove'](cls, 'neo-absolute');
+
+        me.update()
+    }
+
     /**
      * Triggered after the required groupRequired got changed
      * @param {Boolean} value
@@ -463,7 +485,7 @@ class CheckBox extends Base {
         let me        = this,
             cls       = me.cls,
             showError = value && me.showErrorTexts,
-            errorNode;
+            errorNode, errorWrapper;
 
         if (!(me.clean && !me.mounted)) {
             me._error = value; // silent update
@@ -471,7 +493,8 @@ class CheckBox extends Base {
             NeoArray[value ? 'add' : 'remove'](cls, 'neo-invalid');
             me.cls = cls;
 
-            errorNode = me.vdom.cn[1];
+            errorWrapper = me.vdom.cn[1];
+            errorNode    = errorWrapper.cn[0];
 
             if (showError) {
                 errorNode.html = value;
@@ -479,7 +502,7 @@ class CheckBox extends Base {
                 delete errorNode.html;
             }
 
-            errorNode.removeDom = !showError;
+            errorWrapper.removeDom = !showError;
 
             !silent && me.update()
         }

package/src/form/field/Text.mjs

@@ -59,7 +59,7 @@ class Text extends Base {
          */
         centerBorderElWidth: null,
         /**
-         * True shows a clear trigger in case the field has a non empty value.
+         * True shows a clear trigger in case the field has a non-empty value.
          * @member {Boolean} clearable_=true
          */
         clearable_: true,
@@ -73,6 +73,11 @@ class Text extends Base {
          * @member {String|null} error_=null
          */
         error_: null,
+        /**
+         * Useful for fields inside a css grid where errors should live outside the layout
+         * @member {Boolean} errorPositionAbsolute_=false
+         */
+        errorPositionAbsolute_: false,
         /**
          * data passes inputPattern, maxLength, minLength & valueLength properties
          * @member {Function} errorTextInputPattern=data=>`Input pattern violation: ${data.inputPattern}`
@@ -190,7 +195,9 @@ class Text extends Base {
             {tag: 'label', cls: [], style: {}},
             {tag: 'label', cls: []},
             {tag: 'input', cls: ['neo-textfield-input'], flag: 'neo-real-input', style: {}},
-            {cls: ['neo-textfield-error'], removeDom: true}
+            {cls: ['neo-textfield-error-wrapper'], removeDom: true, cn: [
+                {cls: ['neo-textfield-error']}
+            ]}
         ]}
     }
 
@@ -294,6 +301,21 @@ class Text extends Base {
         this.updateError(value)
     }
 
+    /**
+     * Triggered after the errorPositionAbsolute config got changed
+     * @param {Boolean} value
+     * @param {Boolean} oldValue
+     * @protected
+     */
+    afterSetErrorPositionAbsolute(value, oldValue) {
+        let me  = this,
+            cls = VDomUtil.findVdomChild(me.vdom, {cls: 'neo-textfield-error'}).vdom.cls;
+
+        NeoArray[value ? 'add' : 'remove'](cls, 'neo-absolute');
+
+        me.update()
+    }
+
     /**
      * Triggered after the hideLabel config got changed
      * @param {Boolean} value
@@ -1256,13 +1278,14 @@ class Text extends Base {
     updateError(value, silent=false) {
         let me  = this,
             cls = me.cls,
-            errorNode;
+            errorNode, errorWrapper;
 
         if (!(me.clean && !me.mounted)) {
             NeoArray[value ? 'add' : 'remove'](cls, 'neo-invalid');
             me.cls = cls;
 
-            errorNode = VDomUtil.findVdomChild(me.vdom, {cls: 'neo-textfield-error'}).vdom;
+            errorWrapper = VDomUtil.findVdomChild(me.vdom, {cls: 'neo-textfield-error-wrapper'}).vdom;
+            errorNode    = errorWrapper.cn[0];
 
             if (value) {
                 errorNode.html = value;
@@ -1270,7 +1293,7 @@ class Text extends Base {
                 delete errorNode.html;
             }
 
-            errorNode.removeDom = !value;
+            errorWrapper.removeDom = !value;
 
             !silent && me.update()
         }